﻿<!-- #layout name=noMenu --sideType='domain'-->
<div class="page-header">
    <h1 class="title"><span>Domain binding</span>:
        <!-- ko text: rootDomain-->
        <!--/ko-->
    </h1>
</div>
<div class="navbar navbar-default">
    <div class="container-fluid">
        <a class="btn green navbar-btn" data-bind="click: onShowModal"><span>New</span> <i class="fa fa-plus"></i></a>
        <a data-bind="visible: showDeleteBtn, click: onDelete" class="btn red navbar-btn">Delete</a>
    </div>
</div>
<div data-bind="component: { name: 'kb-table', params: tableData }"></div>

<div data-bind="modal: showNewBindingModal" class="modal fade" data-backdrop="static">
    <form action="" method="post" data-ajaxform="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-bind="click: reset"><i class="fa fa-close"></i></button>
                    <h4 class="modal-title">New binding</h4>
                </div>
                <div class="modal-body">
                    <div class="form-horizontal">
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="SubDomain">Record</label>
                            <div class="col-md-9">
                                <div class="input-group input-large" data-bind="error: subDomain">
                                    <input data-bind="value: subDomain" class="form-control form-control" id="SubDomain" name="SubDomain" placeholder="example: www" type="text">
                                    <span class="input-group-addon">.<!-- ko text: rootDomain --><!-- /ko --></span>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="WebSiteId">Site</label>
                            <div class="col-md-9">
                                <select class="form-control input-large" name="WebSiteId" data-bind="options: sites, optionsValue: 'siteId', optionsText: 'siteDisplayName', value: siteId">
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button data-bind="click: save" class="btn green" type="submit">Add</button>
                    <button data-bind="click: reset" class="btn gray">Cancel</button>
                </div>
            </div>
        </div>
    </form>
</div>
<script>
    (function() {
        Kooboo.loadJS([
            "/_Admin/Scripts/components/kbTable.js",
            "/_Admin/Scripts/tableModel.js"
        ])
    })()
</script>
<script src="/_Admin/View/Domains/DomainBinding.js"></script>